import React from 'react'
import { BrowserRouter as Router, Redirect, Route, NavLink, Switch } from 'react-router-dom';
import './my.css'
import pic from './image/my.jpg'
import { ActivityIndicator } from 'antd-mobile'
class Mymyguan extends React.Component {
    constructor(props) {
        super(props);
        this.state = {
			guan: [],
			userid: localStorage.getItem("userid"),
			isShow: true
  	    };
    }
	componentWillMount() {
		//查25关注了谁
		fetch('http://62.234.30.197:8088/guan/idcha', {
			method: 'post',
			body: JSON.stringify({'userid':`${this.state.userid}`}),
			headers: {
			    "Access-Control-Allow-Origin":"*",
			    'content-type': 'application/json'
			},
			mode: 'cors'
		})
		.then(res=>res.json())
		.then(res=> {
			//console.log(res);
			this.setState({
				guan: res,
				isShow: false
			});
		})
	}
    render () {
		return (
        <div>
			<ActivityIndicator
				toast
				text="加载中..."
				animating={this.state.isShow}
			/>
			<div className='Mymsgsetnamesig-top'>
				<span className='my-return' onClick={() => this.props.history.goBack()}>&lt;</span>
				<span className='my-setnamesig-top'>我的关注</span>
			</div>
			<div id="container"></div>
			<div><ul>{
				this.state.guan.map((item, idx) => {
						return <li className='guan-show' key={idx}>
							<div className='' className='my-namesig-box'>
								<img src={item.pic} className='my-guan-pic floatleft'/>
								<span className='guan-txt-name'>{item.name}</span>
								
								<button className='btn-qu-guan' onClick={() => {
									//console.log(123);
									fetch('http://154.8.202.56:8081/user/quguan', {
										method: 'post',
										body: JSON.stringify({'id1':`${this.state.userid}`, 'id2':`${item.userid}`}),
										headers: {
										    "Access-Control-Allow-Origin":"*",
										    'content-type': 'application/json'
										},
										mode: 'cors'
									})
									.then(res=>res.json())
									.then(res=> {
										//console.log(res)
									})
									window.location.reload(true)
								}}>取消关注</button>
								<br /><span className='guan-txt-sig'>{item.signature}</span>
							</div>
						</li>
				})
			}</ul></div>
			
			<div style={{height:'300px'}}></div>
        </div>
    )
  }
}
export default Mymyguan
//<button onClick={this.guan}>id1-id2</button><br /><br />
//id1关注id2
	// guan = () => {
	// 	//console.log('guan');
	// 	fetch('http://62.234.30.197:8088/guan', {
	// 		method: 'post',
	// 		body: JSON.stringify({'id1':'25','id2':'27'}),
	// 		headers: {
	// 		    "Access-Control-Allow-Origin":"*",
	// 		    'content-type': 'application/json'
	// 		},
	// 		mode: 'cors'
	// 	})
	// 	.then(res=>res.json())
	// 	.then(res=> {
	// 		//console.log(res)
			
	// 	})
	// }